<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <script src="./vue.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<div id="app">
   <input type="text" v-model="n1">
    <select v-model="opt">
        <option value="+">+</option>
        <option value="-">-</option>
        <option value="*">*</option>
        <option value="/">/</option>

    </select>
    <input type="text" v-model="n2">
    <input type="button" value="=" @click="compute">
    <input type="text" v-model="result">

</div>
<script>
    // 创建一个vue实例
    new Vue({
        el:'#app',
        data:{
            msg:'信息',
            n1:'0',
            n2:'0',
            result:'0',
            opt:'+'
        },
        methods:{
            compute() {
//                switch( this.opt){
//                    case '+':
//                        this.result  = parseFloat(this.n1) + parseFloat(this.n2)
//                    break
//                    case '-':
//                        this.result  = parseFloat(this.n1) - parseFloat(this.n2)
//                        break
//                    case '*':
//                        this.result  = parseFloat(this.n1) * parseFloat(this.n2)
//                        break
//                    case '/':
//                        this.result  = parseFloat(this.n1) / parseFloat(this.n2)
//                        break
//                }
                var codeStr = 'parseFloat(this.n1) '+this.opt+' parseFloat(this.n2)'
                //eval解析执行
                this.result = eval(codeStr)
            }

        }
    })
</script>
</body>
</html>
